import Vuex from 'vuex'
import defaultState from './state/state'
import mutations from './mutations/mutations'
import getters from './getters/getters'
import actions from './actions/actions'
//入口文件,服务端渲染，每次都需要创建一个,每次服务端同一个会出问题

// 设置严格模式，就不能在mutations之外修改数据,这个最好不要在外部修改，会出现警告，正式环境不要设置这个，所以一般会这样写：
const isDev = process.env.NODE_ENV === 'dev'

export default () => {
  const store = new Vuex.Store({
    strict: isDev,
    state: defaultState,
    // 修改数据
    mutations,
    getters,
    actions,
    plugins: [
      (store) => {
        // 初始化的时候就执行
        console.log('plugins')
      }
    ],
    modules: {
      a: {
        namespaced: true,
        state: {
          text: 1,
          pid: 56789
        },
        mutations: {
          updateText(state, text) {
            state.text = text
            console.log('a.state', state)
          }
        },
        getters: {
          textplus(state, getters, rootState) {
            console.log(getters)
            return state.text + rootState.count + rootState.b.text
          }
        },
        actions: {
          add({
            state,
            commit,
            rootState
          }) {
            commit('updateText', rootState.count)
          },
          // 修改全局的方法
          changeCount({
            state,
            commit,
            rootState
          }) {
            commit('updateCount', {
              num: state.pid
            }, {
              root: true
            })
            console.log(rootState.count, 'count')
          }
        }
      },
      b: {
        namespaced: true,
        state: {
          text: 2
        },
        actions: {
          textAction({
            commit,
            rootState
          }) {
            commit('a/updateText', 'test text', {
              root: true
            })
            console.log(rootState.a.text, 'a.text')
          }
        }
      }
    }
  })
  // webpack热加载的功能
  if (module.hot) {
    module.hot.accept([
      './state/state',
      './mutations/mutations',
      './getters/getters',
      './actions/actions'
    ], () => {
      const newState = require('./state/state').default
      const newMutations = require('./mutations/mutations').default
      const newGetters = require('./getters/getters').default
      const newActions = require('./actions/actions').default
      store.hotUpdate({
        state: newState,
        mutations: newMutations,
        getters: newGetters,
        actions: newActions
      })
    })
  }
  return store
}

/*
模块里面的mutatios,可以直接在页面mapmutatons里面使用，默认都会放到全局的命名空间中，
为了不跟全局的冲突，设置一个属性namespaced为true,调用的时候（模块名/+方法名）eg：
...mapMutations(['updateCount','a/updateText'])  this['a/updateText'](123)

1.getters(state,getters,rootState)
state:当前模块里面的state的值
rootState：全局的state里面的值
getters:当前模块下面的所有的getters方法

2，actions:默认调用的是当前模块的方法，eg:updateText
如果要调用全局的actions的方法，或者其他模块的方法，都需要设置全局属性
需要设置全局属性{
    root:true
}
nameSpaced的属性设置时，一定要记得加上模块名，夸模块调用和调用的全局模块的值都需要设置root:true
3，模块可以无限嵌套去模块
4,更改完需要刷新才会更新，给vuex加上热加载的方法
5，修改vuex数据
 */
